<template>
    <div class="top">
        <van-icon name="arrow-left" size="30" @click="go_back" />
        <div class="tittle">
            编辑地址
        </div>
        <div></div>
    </div>
    <van-address-edit :area-list="areaList" :address-info="address_info" show-set-default show-search-result
        :area-columns-placeholder="['请选择', '请选择', '请选择']" @save="onSave" />
</template>
    
<script setup lang='ts'>
import { useMainStore } from '@/store';
import { areaList } from '@vant/area-data';
import { Toast } from "vant";
import { onMounted, ref } from "vue"
import { useRouter, useRoute } from 'vue-router';
import Product from '@/api/main';
let _product = new Product()

const Router = useRouter()
const Route = useRoute()
let address_info: any = ref({});
let id: any = ref('')


onMounted(() => {
    id.value = Route.query.id
    if (id.value) {
        _product.getAddressById({
            id: id.value
        }).then(res => {
            address_info.value = res.data[0]
            // console.log(res.data);
        })
    }
})


const onSave = (result: any) => {
    if (id.value) {
        result.id = id.value
        _product.updateAddress(result).then(res => { })
    } else {
        _product.addAddress(result).then(res => { })
    }
    Toast.success('保存成功')
    Router.go(-1)
};
function go_back() {
    Router.go(-1)
}

</script>
    
<style scoped>
.top {
    padding: 3vw;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.tittle {
    display: inline-block;
    font-size: larger;
    font-weight: 600;
}
</style>